<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <style type="text/css">
        #div{
            height: 1000px;
            width: 1000px;
            display: flex;
        }
        #div1{
            height: 1000px;
            width: 200px;
            /* background-color: aqua; */
        }
        #div2{
            height: 1000px;
            width: 800px;
            /* background-color: yellow; */
        }

    </style>
</head>
<body>
<form action="upload1.php" method="post" enctype="multipart/form-data">
<div id="div">
    <div id="div1">
        <h2>头像选择:</h2>
        <input type="file" name="file" id="file" value="file" multiple="multiple" onchange="showImg()"/>
        <img src="" id="showImg1">
    </div>
    <div id="div2">

            <h3>姓名:</h3>
            <input type="text" name="" id="" value="" />
            <br/>
            <h3>公司:</h3>
            <input type="text" name="" id="" value="" />
            <br/>
            <h3>特长:</h3>
            <input type="text" name="" id="" value=""/>
            <br/>
            <h3>个人介绍:</h3>
            <textarea rows="5" cols="100">

            </textarea>
            <br/>
            <input type="submit" name="" id="" value="提交" />
    </div>
</div>
</form>
</body>
<script type="text/javascript">
    function showImg(){
        var arr=document.getElementById('file');
        var files = arr['files'];


        var URL = window.URL || window.webkitURL;
        var imgURL = URL.createObjectURL(files[0]);
        console.log(imgURL);

        document.getElementById('showImg1').src = imgURL;
    }
</script>
</html>
